<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>message</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link href="../../css/font-awesome.min.css" rel="stylesheet" />
		<link href="../../css/app.css" rel="stylesheet" />
		<script src="../../js/mui.min.js"></script>
		<style>
		.circle { 
                position: fixed; 
                text-align: center; 
                margin-right: calc((20% - 65px)/2); 
                right: 0;
                bottom: 18px; 
                width: 65px; 
                height: 65px;
                padding:20px;                
                border-radius: 50px; 
                background: rgba(100, 177, 245, 0.8); 
                z-index: 99; 
        } 
			
			
		</style>
		
	</head>  

	<body>
		<header class="mui-bar mui-bar-nav app-main-background-color" >
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">通信录</h1>
		</header>
<div class="mui-content">
<ul class="mui-table-view">

</ul>
</div>

		<script src="../../js/jquery-1.12.4.min.js"></script>
		<script src="../../js/app.js"></script>
		<script type="text/javascript">
				
				var page = 1;
				mui.init();
				var count = 0;
				
				mui(".mui-table-view").on('tap','li',function(e){
					var phone = $(this).attr("phone");
    					plus.nativeUI.confirm("您确定要拨打电话吗？",function(event){
            				if(event.index ==0){
                				plus.device.dial( phone, false );
            				}else{
                				return false;
            				}
        				});
				});
			
			window.addEventListener('groupId', function() {

  				var id = event.detail.id;
  				
  				var user = JSON.parse(localStorage.getItem('user') || '{}');
				if(user){
				}else {
					this.toLogin();
				}
				
				var table = document.body.querySelector('.mui-table-view');
				table.innerHTML = "";
				
				console.log(app.SERVER_URL);
  				var loginUrl = app.SERVER_URL+"/mobile/getallcontacts"; 
				jQuery.ajax(loginUrl,{
						data: {
							'ID': id,
							'LOGIN_NAME':user.LOGIN_NAME,
							'TOKEN':user.TOKEN
						},	
						//contentType: "application/json",
						dataType:'json',//服务器返回json格式数据
						type:'post',//HTTP请求类型 
						timeout:100000,//超时时间设置为100秒； 
						success:function(data){
							var resultCode = data[0].RESULT_CODE;
							var resultInfo = data[0].RESULT_INFO;
							if (resultCode == '0'){
								var coop_name = "";
								for(var i = 0 ; i < data.length ; i ++){
									var li = document.createElement('li');
									$(li).attr("phone",data[i].MOBILE_PHONE);
										li.className = 'mui-table-view-cell mui-media';
										
										if(data[i].COOP_NAME == undefined || data[i].COOP_NAME == null || data[i].COOP_NAME == '' ){
											coop_name="";
										}
										else{
											coop_name = data[i].COOP_NAME;
										}

										li.innerHTML='<a href="javascript:;">'+
											'<i class="fa fa-user-o fa mui-pull-left" style="margin-right:0.2em ;" aria-hidden="true"></i> '+
												'<div class="mui-media-body mui-pull-left"> <div>'+
													data[i].USER_NAME +
												'<div><p class="mui-ellipsis">'+coop_name +'</p></div>'+
												'</div><p class="mui-ellipsis">'+data[i].MOBILE_PHONE +'</p>'+
												'</div>'+
											'<i class="fa fa-phone fa-2x mui-pull-right" style="margin-right:0.2em ;" aria-hidden="true"></i> '+
											'</a>';

										table.appendChild(li);
										console.log(li.innerHTML);
								}
								plus.nativeUI.toast(resultInfo);
							}else{
								plus.nativeUI.toast(resultInfo);
								return ;
							}
						},
						error:function(xhr,type,errorThrown){  
							//异常处理；  
							console.log(type); 
							return plus.nativeUI.toast('登录异常，请重试！错误详情：'+type);
						}
					});

			}, false);
			
		</script>
	</body>

</html>    